// 模拟商家数据
const merchants = [
    {
        id: 1,
        name: '老王炸鸡',
        rating: 4.8,
        description: '正宗炸鸡，口感酥脆',
        image: 'https://via.placeholder.com/300x180',
        category: '快餐便当',
        deliveryTime: '30分钟',
        minPrice: 20
    },
    {
        id: 2,
        name: '川味小馆',
        rating: 4.6,
        description: '地道川菜，麻辣鲜香',
        image: 'https://via.placeholder.com/300x180',
        category: '特色菜系',
        deliveryTime: '40分钟',
        minPrice: 30
    },
    {
        id: 3,
        name: '张练重生之卖烤鸭',
        rating: 4.6,
        description: '地道川菜，麻辣鲜香',
        image: 'https://via.placeholder.com/300x180',
        category: '异国料理',
        deliveryTime: '50分钟',
        minPrice: 40
    },
    {
        id: 4,
        name: '霸道总裁杨波林烧烤买大奔',
        rating: 2.6,
        description: '地道川菜，麻辣鲜香',
        image: 'https://via.placeholder.com/300x180',
        category: '小吃夜宵',
        deliveryTime: '30分钟',
        minPrice: 60
    },
    {
        id: 5,
        name: '阿伟下山被女上司捡回家做甜品',
        rating: 5.2,
        description: '逆袭 情感 都市',
        image: 'https://via.placeholder.com/300x180',
        category: '甜品饮品',
        deliveryTime: '30分钟',
        minPrice: 60
    },
    // 可以添加更多商家数据
];

// 渲染商家列表
function renderMerchants(merchantList = merchants) {
    const merchantListElement = document.getElementById('merchantList');
    merchantListElement.innerHTML = merchantList.map(merchant => `
        <div class="merchant-card">
            <img src="${merchant.image}" alt="${merchant.name}" class="merchant-img">
            <div class="merchant-info">
                <h3 class="merchant-name">${merchant.name}</h3>
                <div class="merchant-rating">
                    <i class="fas fa-star"></i>
                    ${merchant.rating}
                </div>
                <p class="merchant-desc">${merchant.description}</p>
                <div class="merchant-meta">
                    <span><i class="fas fa-clock"></i> ${merchant.deliveryTime}</span>
                    <span><i class="fas fa-yen-sign"></i> 起送 ${merchant.minPrice}元</span>
                </div>
            </div>
        </div>
    `).join('');
}

// 搜索功能
const searchInput = document.querySelector('.search-input');
searchInput.addEventListener('input', (e) => {
    const searchTerm = e.target.value.toLowerCase();
    const filteredMerchants = merchants.filter(merchant => 
        merchant.name.toLowerCase().includes(searchTerm) ||
        merchant.description.toLowerCase().includes(searchTerm)
    );
    renderMerchants(filteredMerchants);
});

// 分类筛选
const categoryTags = document.querySelectorAll('.category-tag');
categoryTags.forEach(tag => {
    tag.addEventListener('click', () => {
        const category = tag.textContent;
        categoryTags.forEach(t => t.classList.remove('active'));
        tag.classList.add('active');
        
        if (category === '全部') {
            renderMerchants();
        } else {
            const filteredMerchants = merchants.filter(merchant => 
                merchant.category === category
            );
            renderMerchants(filteredMerchants);
        }
    });
});

// 检查登录状态
function checkLoginStatus() {
    // 这里可以添加实际的登录状态检查逻辑
    const isLoggedIn = localStorage.getItem('isLoggedIn');
    const loginBtn = document.getElementById('loginBtn');
    
    if (isLoggedIn) {
        loginBtn.textContent = '退出';
        loginBtn.href = '#';
        loginBtn.addEventListener('click', (e) => {
            e.preventDefault();
            localStorage.removeItem('isLoggedIn');
            window.location.reload();
        });
    }
}

// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', () => {
    renderMerchants();
    checkLoginStatus();
});

// 添加响应式导航菜单
const navLinks = document.querySelector('.nav-links');
const menuBtn = document.createElement('button');
menuBtn.classList.add('menu-btn');
menuBtn.innerHTML = '<i class="fas fa-bars"></i>';

document.querySelector('.nav').insertBefore(menuBtn, navLinks);

menuBtn.addEventListener('click', () => {
    navLinks.classList.toggle('show');
});
